﻿<?xml version="1.0" encoding="utf-8" ?>
<View xmlns="http://mobileui.codeplex.com/v1"
              xmlns:x="http://mobileui.codeplex.com/xaml"
              xmlns:Demo="Demo.Presenters,Demo"
              DesiredSize="Unbound">

  <View.MenuBar>
    <MenuBar>
      <MenuBar.MenuItems>
        <MenuBarItem Text="Back" Command="{Binding BackCommand}"/>
        <MenuBarItem Text="Layout" Command="{Binding ToggleLayoutCommand}"/>
      </MenuBar.MenuItems>
    </MenuBar>
  </View.MenuBar>
  
  <GradientRectangleElement DesiredSize="Unbound" StartColor="240,240,240" EndColor="255,100,80"/>

  <TextElement DesiredSize="Unbound" Foreground="200,200,200" Text="Layout Demo" Angle="315" AutoSize="True" HorizontalAlignment="Center" VerticalAlignment="Center"/>

  <DrawingPanel DesiredSize="UnboundAxis,92" Background="{null}" VerticalAlignment="Center" Stroke="{null}">
    <DrawingPanel.LayoutEngine>
      <StackLayout Margin="8,4" Padding="4"/>
    </DrawingPanel.LayoutEngine>

    <GlassButton Text="Add Item" DesiredSize="200, 80" HorizontalAlignment="Center" Background="{null}" Command="{Binding AddItemCommand}"/>
    <GlassButton Text="Remove Item" DesiredSize="200, 80" HorizontalAlignment="Center" Background="{null}" Command="{Binding RemoveItemCommand}"/>

  </DrawingPanel>

  <ItemsControl x:Name="layoutContainer"
                DesiredSize="Unbound" HorizontalAlignment="Center" VerticalAlignment="Bottom" Background="{null}"
                Items="{Binding Items}">
    <ItemsControl.LayoutEngine>
      <StackLayout AnimateMovements="True" AnimationDuration="0:0:1">
        <StackLayout.AnimationEasing>
          <ElasticEasing/>
        </StackLayout.AnimationEasing>
      </StackLayout>
    </ItemsControl.LayoutEngine>
    <ItemsControl.ItemTemplate>
      <Demo:DemoItemTemplate/>
    </ItemsControl.ItemTemplate>
  </ItemsControl>
  
</View>
